/* pages/index3/index3.wxss */
.container{
    height: 100vh;
    background-repeat: no-repeat;
    background-position: center center;
    background: url("https://i0.hdslb.com/bfs/album/27669f203e4190c4b45f8cc25df90e58b22c38a7.png");
    background-size: cover;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    // z-index: 1;
    .river{
        position: relative;
        top: 4vh;
        width: 80%;
        image{
            width: 100%;
            // z-index: 0;
        }
        .river-text{
            color: #666;
            font-size: 12px;
            float: right;
        }    
    }
    .main{
        background: url("https://i0.hdslb.com/bfs/album/80d753430f065290f74dd126d3a0b79eb21039b6.png");
        background-position: center center;
        background-repeat: no-repeat;
        background-size: 100% 80vh; 
        padding: 15px;
        display: flex;
        height: 80%;
        width: 280px;
        margin: auto;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        flex-wrap: nowrap;
        .title{
            font-size: 16px;
        }
        .box{
            display: flex;
            align-items: center;
            justify-content: center;
            .input{
                text-align: center;
                // background-color: #f5f5f5;
                text-decoration: #000;
                display: inline-block;
                position: relative;
                width: 30%;
                border-bottom: 1px solid #000;
            }
            .text{
                display: inline-block;
            }
        }
        .tips{
            font-weight: 800;
            padding-top: 10px;
            font-size: 14px;
        }
        .btn{
            margin-top: 40px;
            color: #fff;
            background-color: var(--themeColor);
        }
        .btn:active{
            background-color: var(--btnClickColor);
        }
    }
}